{% extends 'base.twig' %}

{% block head %}
	<script type="text/javascript">
		function backup() {
			$('#confirmBox').modal('hide');
			$.fancybox.showLoading();
			$.ajax({
				dataType: 'json',
				url: '/admin/backup/backup',
				success: function (d) {
					$.fancybox.hideLoading();
					$('#backup .panel-body pre').removeClass('hidden').html(d['result'].replace('\n', '<br>'));

					var tr = $('<tr></tr>');
					var html = '<td>' + d['row']['date'] + '</td><td>2</td><td>' +
							'<button type="button" class="btn btn-primary btn-xs" data-click="restore(\'' + d['row']['prefix'] + '\');" data-toggle="modal" data-target="#confirmBox" data-text="Выполнить восстановление?"><span class="glyphicon glyphicon glyphicon-import"></span> Восстановить</button>' +
							'<button type="button" class="btn btn-danger btn-xs" data-click="deleteBackup(\'' + d['row']['prefix'] + '\');" data-toggle="modal" data-target="#confirmBox" data-text="Удалить?"><span class="glyphicon glyphicon-remove"></span> Удалить</button></td>';
					tr.attr('id', 'row_' + d['row']['prefix']).html(html);

					$('#backups tbody').prepend(tr);
				}
			})
		}

		function restore(prefix) {
			$('#confirmBox').modal('hide');

			$.fancybox.showLoading();
			$.ajax({
				dataType: 'json',
				url: '/admin/backup/restore',
				data: {prefix: prefix},
				success: function (d) {
					$.fancybox.hideLoading();
					$('#restore .panel-body pre').removeClass('hidden').html(d['result'].replace('\n', '<br>'));
				}
			})
		}

		function deleteBackup(prefix) {
			$('#confirmBox').modal('hide');

			$.fancybox.showLoading();
			$.ajax({
				dataType: 'json',
				url: '/admin/backup/delete',
				data: {prefix: prefix},
				success: function (d) {
					$.fancybox.hideLoading();
					$('#row_' + prefix).hide();
				}
			})
		}
	</script>
{% endblock %}

{% block content %}
	<div class="row">
		<div class="col-md-12">
			<h2>Резервное копирование / восстановление</h2>

			<div class="panel-group" id="accordion">
				<div class="panel panel-default">
					<div class="panel-heading">
						<h4 class="panel-title">
							<a data-toggle="collapse" data-parent="#accordion" href="#backup"><span class="glyphicon glyphicon glyphicon-export"></span>Резервное копирование</a>
						</h4>
					</div>
					<div id="backup" class="panel-collapse collapse in">
						<div class="panel-body">

							<button type="button" class="btn btn-primary btn" data-click="backup();" data-toggle="modal" data-target="#confirmBox" data-text="Выполнить резервное копирование?">
								<span class="glyphicon glyphicon-export"></span> Выполнить
							</button>
							<pre class="hidden" style="max-height: 400px;margin-top: 10px;"></pre>
						</div>
					</div>
				</div>
				<div class="panel panel-default">
					<div class="panel-heading">
						<h4 class="panel-title">
							<a data-toggle="collapse" data-parent="#accordion" href="#restore"><span class="glyphicon glyphicon glyphicon-import"></span> Восстановление
							</a>
						</h4>
					</div>
					<div id="restore" class="panel-collapse collapse">
						<div class="panel-body">
							<table class="table table-striped" id="backups">
								<thead>
								<tr>
									<th>Дата</th>
									<th>Файлов</th>
									<th></th>
								</tr>
								</thead>
								<tbody>
								{% for prefix,backup in backups %}
									<tr id="row_{{ prefix }}">
										<td>{{ backup.date }}</td>
										<td>{{ backup.filename|length }}</td>
										<td>
											<button type="button" class="btn btn-primary btn-xs" data-click="restore('{{ prefix }}');" data-toggle="modal" data-target="#confirmBox" data-text="Выполнить восстановление?">
												<span class="glyphicon glyphicon glyphicon-import"></span> Восстановить
											</button>
											<button type="button" class="btn btn-danger btn-xs" data-click="deleteBackup('{{ prefix }}');" data-toggle="modal" data-target="#confirmBox" data-text="Удалить?">
												<span class="glyphicon glyphicon-remove"></span> Удалить
											</button>
										</td>
									</tr>
								{% endfor %}
								</tbody>
							</table>
							<pre class="hidden" style="max-height: 400px;margin-top: 10px;"></pre>
						</div>
					</div>
				</div>
			</div>


		</div>
	</div>
{% endblock %}